<link rel="stylesheet" href="https://www.irugbystore.com/catalog/view/javascript/fancybox/dist/fancybox/fancybox.css" />
<script src="https://www.irugbystore.com/catalog/view/javascript/fancybox/dist/fancybox/fancybox.umd.js"></script>
{{ header }}
{% set theme_options = registry.get('theme_options') %}
{% set config = registry.get('config') %}
{% set page_direction = theme_options.get( 'page_direction' ) %}
{% set language_id = config.get( 'config_language_id' ) %}
{% set background_status = constant('false') %}
{% set product_page = constant('true') %}
{% include 'fastor/template/new_elements/wrapper_top.twig' %}

<div>
	<div class="product-info">
		<div class="row">

			{% set product_custom_block = theme_options.getModules('product_custom_block') %}

			<div class="col-md-{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1 or product_custom_block|length > 0) %}9{% else %}12{% endif %} col-sm-12">
				<div class="row" id="quickview_product">
					{% if (theme_options.get( 'product_image_zoom' ) != 2) %}
						<script>
							$(document).ready(function(){
								if($(window).width() > 992) {
									{% if (theme_options.get( 'product_image_zoom' ) == 1) %}
									$('#image').elevateZoom({
										zoomType: "inner",
										cursor: "pointer",
										zoomWindowFadeIn: 500,
										zoomWindowFadeOut: 750
									});
									{% else %}
									$('#image').elevateZoom({
										zoomWindowFadeIn: 500,
										zoomWindowFadeOut: 500,
										zoomWindowOffetx: 20,
										zoomWindowOffety: -1,
										cursor: "pointer",
										lensFadeIn: 500,
										lensFadeOut: 500,
										zoomWindowWidth: 500,
										zoomWindowHeight: 500
									});
									{% endif %}

									var z_index = 0;

									$(document).on('click', '.open-popup-image', function () {
										$('.popup-gallery').magnificPopup('open', z_index);
										return false;
									});

									$('.thumbnails a, .thumbnails-carousel a').click(function() {
										var smallImage = $(this).attr('data-image');
										var largeImage = $(this).attr('data-zoom-image');
										var ez =   $('#image').data('elevateZoom');
										$('#ex1').attr('href', largeImage);
										ez.swaptheimage(smallImage, largeImage);
										z_index = $(this).index('.thumbnails a, .thumbnails-carousel a');
										return false;
									});
								} else {
									$(document).on('click', '.open-popup-image', function () {
										$('.popup-gallery').magnificPopup('open', 0);
										return false;
									});
								}
							});
						</script>
					{% endif %}
					{% set image_grid = 7 %} {% set product_center_grid = 5 %}
					{% if (theme_options.get( 'product_image_size' ) == 1) %}
						{% set image_grid = 4 %} {% set product_center_grid = 8 %}
					{% endif %}

					{% if (theme_options.get( 'product_image_size' ) == 3) %}
						{% set image_grid = 8 %} {% set product_center_grid = 4 %}
					{% endif %}

					<div class="col-sm-{{ image_grid }} popup-gallery">

						{% set product_image_top = theme_options.getModules('product_image_top') %}
						{% if ( product_image_top|length > 0 ) %}
							{% for module in product_image_top %}
								{{ module }}
							{% endfor %}
						{% endif %}

						<div class="row">
							{% if ((images or theme_options.get( 'product_image_zoom' ) != 2) and theme_options.get( 'position_image_additional' ) == 2) %}
								<div class="col-sm-2">
									<div class="thumbnails thumbnails-left clearfix">
										<ul>
											{% if (theme_options.get( 'product_image_zoom' ) != 2 and thumb) %}
												<li><p><a href="{{ popup }}" class="popup-image" data-image="{{ thumb }}" data-zoom-image="{{ popup }}"><img src="{{ theme_options.productImageThumb(product_id, config.get('theme_default_image_additional_width'), config.get('theme_default_image_additional_height')) }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></p></li>
											{% endif %}
											{% for image in images %}
												<li><p><a href="{{ image['popup'] }}" class="popup-image" data-image="{{ image['popup'] }}" data-zoom-image="{{ image['popup'] }}"><img src="{{ image['thumb'] }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></p></li>
											{% endfor %}
										</ul>
									</div>
								</div>
							{% endif %}

							<div class="col-sm-{% if (theme_options.get( 'position_image_additional' ) == 2) %}{{ 10 }}{% else %}{{ 12 }}{% endif %}">
								{% if (thumb) %}
									<div class="product-image {% if (theme_options.get( 'product_image_zoom' ) != 2) %} {% if (theme_options.get( 'product_image_zoom' ) == 1) %} {{ 'inner-cloud-zoom' }} {% else %} {{ 'cloud-zoom' }} {% endif %} {% endif %}">
										{% if (special and theme_options.get( 'display_text_sale' ) != '0') %}
											{% set text_sale = 'Sale' %}
											{% if (theme_options.get( 'sale_text', config.get( 'config_language_id' ) ) != '') %}
												{% set text_sale = theme_options.get( 'sale_text', config.get( 'config_language_id' ) ) %}
											{% endif %}
											{% if (theme_options.get( 'type_sale' ) == '1') %}
												{% set product_detail = theme_options.getDataProduct( product_id ) %}
												{% set roznica_ceny = product_detail['price']-product_detail['special'] %}
												{% set procent = roznica_ceny*100/product_detail['price'] %}
												<div class="sale">-{{ procent|round }}%</div>
											{% else %}
												<div class="sale">{{ text_sale }}</div>
											{% endif %}
										{% elseif (theme_options.get( 'display_text_new' ) != '0' and theme_options.isLatestProduct( product_id )) %}
											<div class="new">{% if (theme_options.get( 'new_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'new_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'New' }} {% endif %}</div>
										{% endif %}

										<a href="{{ popup }}" title="{{ heading_title }}" id="ex1" {% if (theme_options.get( 'product_image_zoom' ) == 2) %}class="popup-image"{% else %} {{ 'class="open-popup-image"' }} {% endif %}><img src="{{ thumb }}" title="{{ heading_title }}" alt="{{ heading_title }}" id="image" data-zoom-image="{{ popup }}" /></a>
									</div>
								{% else %}
									<div class="product-image">
										<img src="image/no_image.jpg" title="{{ heading_title }}" alt="{{ heading_title }}" id="image" />
									</div>
								{% endif %}
							</div>

							{% if ((images or theme_options.get( 'product_image_zoom' ) != 2) and theme_options.get( 'position_image_additional' ) != 2) %}
								<div class="col-sm-12">
									<div class="overflow-thumbnails-carousel clearfix">
										<div class="thumbnails-carousel owl-carousel">
											{% if (theme_options.get( 'product_image_zoom' ) != 2 and thumb) %}
												<div class="item"><a href="{{ popup }}" class="popup-image" data-image="{{ thumb }}" data-zoom-image="{{ popup }}"><img src="{{ theme_options.productImageThumb(product_id, config.get('theme_default_image_additional_width'), config.get('theme_default_image_additional_height')) }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></div>
											{% endif %}
											{% for image in images %}
												<div class="item"><a href="{{ image['popup'] }}" class="popup-image" data-image="{{ image['popup'] }}" data-zoom-image="{{ image['popup'] }}"><img src="{{ image['thumb'] }}" title="{{ heading_title }}" alt="{{ heading_title }}" /></a></div>
											{% endfor %}
										</div>
									</div>

									<script type="text/javascript">
										$(document).ready(function() {
											$(".thumbnails-carousel").owlCarousel({
												autoPlay: 6000, //Set AutoPlay to 3 seconds
												navigation: true,
												navigationText: ['', ''],
												itemsCustom : [
													[0, 4],
													[450, 5],
													[550, 6],
													[768, 3],
													[1200, 4]
												],
												{% if (page_direction[language_id] == 'RTL') %}
												direction: 'rtl'
												{% endif %}
											});
										});
									</script>

									<!-- 在此处插入你要加的代码 -->
									<script>
										$(document).ready(function(){
											$(document).on("click", ".owl-prev, .owl-next", function () {
												console.log($activeItem, smallImage, largeImage);
											});
										});
									</script>
								</div>
							{% endif %}

						</div>


						{% set product_image_bottom = theme_options.getModules('product_image_bottom') %}
						{% if ( product_image_bottom|length > 0 ) %}
							{% for module in product_image_bottom %}
								{{ module }}
							{% endfor %}
						{% endif %}
					</div>

					<div class="col-sm-{{ product_center_grid }} product-center clearfix">
						<div>
							{% set product_options_top = theme_options.getModules('product_options_top') %}
							{% if ( product_options_top|length > 0 ) %}
								{% for module in product_options_top %}
									{{ module }}
								{% endfor %}
							{% endif %}

							{% if (review_status) %}
								<div class="review">
									{% if (rating > 0) %}
										<span>{{ heading_title }}</span>
										<span>{{ rating }}</span>
										<span>100</span>
										</span>
									{% endif %}
									<div class="rating"><i class="fa fa-star{% if (rating >= 1) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 2) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 3) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 4) %} {{ ' active' }} {% endif %}"></i><i class="fa fa-star{% if (rating >= 5) %} {{ ' active' }} {% endif %}"></i>&nbsp;&nbsp;&nbsp;<a onclick="$('a[href=\'#tab-review\']').trigger('click'); $('html, body').animate({scrollTop:$('#tab-review').offset().top}, '500', 'swing');">{{ reviews }}</a>&nbsp;&nbsp;|&nbsp;&nbsp;<a onclick="$('a[href=\'#tab-review\']').trigger('click'); $('html, body').animate({scrollTop:$('#tab-review').offset().top}, '500', 'swing');">{{ text_write }}</a></div>
									{% if (theme_options.get( 'product_social_share' ) != '0') %}
										<div class="share">
											<!-- AddThis Button BEGIN -->
											<div class="addthis_toolbox addthis_default_style"><a class="addthis_button_facebook_like" fb:like:layout="button_count"></a> <a class="addthis_button_tweet"></a> <a class="addthis_button_pinterest_pinit"></a> <a class="addthis_counter addthis_pill_style"></a></div>
											<script type="text/javascript" src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-515eeaf54693130e"></script>
											<!-- AddThis Button END -->
										</div>
									{% endif %}
								</div>
							{% endif %}

							<div class="description">
								{% if (manufacturer) %}
									<span>{{ text_manufacturer }}</span> <a href="{{ manufacturers }}">{{ manufacturer }}</a><br />
								{% endif %}
								<span>{{ text_model }}</span> {{ model }}<br />
								{% if (reward) %}
									<span>{{ text_reward }}</span> {{ reward }}<br />
								{% endif %}
								<span>{{ text_stock }}</span> {{ stock }}</div>
							{% if (price) %}
								<div class="price">
									{% if (theme_options.get( 'display_specials_countdown' ) == '1' and special) %} {% set countdown = random(5000)*random(50000) %}
										{% set product_detail = theme_options.getDataProduct( product_id ) %}
										{% set date_end = product_detail['date_end'] %}
										{% if (date_end != '0000-00-00' and date_end) %}
											<script>
												$(function () {
													var austDay = new Date();
													austDay = new Date({{ theme_options.date("Y", theme_options.strtotime(date_end)) }}, {{ theme_options.date("m", theme_options.strtotime(date_end)) }} - 1, {{ theme_options.date("d", theme_options.strtotime(date_end)) }});
													$('#countdown{{ countdown }}').countdown({until: austDay});
												});
											</script>
											<h3>{% if (theme_options.get( 'limited_time_offer_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'limited_time_offer_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Limited time offer' }} {% endif %}</h3>
											<div id="countdown{{ countdown }}" class="clearfix"></div>
										{% endif %}
									{% endif %}
									{% if (not special) %}
										<span class="price-new"><span id="price-old">{{ price }}</span></span>
									{% else %}
										<span class="price-new"><span id="price-special">{{ special }}</span></span> <span class="price-old" id="price-old">{{ price }}</span>
									{% endif %}
									<br />
									{% if (tax) %}
										<span class="price-tax">{{ text_tax }} <span id="price-tax">{{ tax }}</span></span><br />
									{% endif %}
									{% if (points) %}
										<span class="reward"><small>{{ text_points }} {{ points }}</small></span><br />
									{% endif %}
									{% if (discounts) %}
										<br />
										<div class="discount">
											{% for discount in discounts %}
												{{ discount['quantity'] }}{{ text_discount }}{{ discount['price'] }}<br />
											{% endfor %}
										</div>
									{% endif %}
								</div>
							{% endif %}
						</div>

						<div id="product">
							{% if size_chart %}
								<a href="{{ size_chart }}" data-fancybox="sizechart" class="size_ruler">
									<img src="image/catalog/size_chart.png" alt="Size Chart" style="width:18px;height:12px;vertical-align:middle;margin-right:4px;">
									{{text_size_chart}}
								</a>
								<style>
									.fancybox__content {
										position: relative;
									}

									.fancybox-button--close {
										font-weight: bold;
										position: absolute !important;
										top: 5px;
										right: 5px;
										background: rgba(0,0,0,0.5);
										border-radius: 50%;
										color: #fff;
										padding: 5px 8px;
										font-size: 16px;
										line-height: 1;
										cursor: pointer;
									}
								</style>

								<script>
									document.addEventListener("DOMContentLoaded", function() {
										Fancybox.bind("[data-fancybox='sizechart']", {
											Toolbar: {
												display: [],
											},
											closeButton: "top",
											Image: {
												zoom: true,
											},
										});
									});
								</script>
							{% endif %}
							{% set product_options_center = theme_options.getModules('product_options_center') %}
							{% if (options or product_options_center|length > 0) %}
								<div class="options">
									{% for module in product_options_center %} {{ module }} {% endfor %}

									{% if (options) %}
										<div class="options2">
											<h2>{{ text_option }}</h2>
											{% for option in options %}

												{% if (option['type'] == 'text_personalise') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														{% for option_value in option['product_option_value'] %}
															<input type="text" name="option[{{ option['product_option_id'] }}][]" value=""
																   placeholder="{{ option_value['name'] }}" id="input-option{{ option_value['option_value_id'] }}" class="form-control" />
														{% endfor %}
													</div>
												{% endif %}

												{% if (option['type'] == 'select') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<select name="option[{{ option['product_option_id'] }}]" id="input-option{{ option['product_option_id'] }}" class="form-control">
															<option value="">{{ text_select }}</option>
															{% for option_value in option['product_option_value'] %}
																<option value="{{ option_value['product_option_value_id'] }}">{{ option_value['name'] }}
																	{% if (option_value['price']) %}
																		({{ option_value['price_prefix'] }}{{ option_value['price'] }})
																	{% endif %}
																</option>
															{% endfor %}
														</select>
													</div>
												{% endif %}

												{% if (option['type'] == 'radio') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label">{{ option['name'] }}</label>
														<div id="input-option{{ option['product_option_id'] }}">
															{% for option_value in option['product_option_value'] %}
																<div class="radio {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} {{ 'radio-type-button2' }} {% endif %}">
																	<label>
																		<input type="radio" name="option[{{ option['product_option_id'] }}]" value="{{ option_value['product_option_value_id'] }}" />
																		<span {% if (option_value['image']) %} {{ 'style="padding: 2px"' }} {% endif %}>{% if (not option_value['image']) %}{{ option_value['name'] }}{% endif %}
																			{% if (option_value['image']) %}
																				<img src="{{ option_value['image'] }}" alt="{{ option_value['name'] ~ option_value['price'] ? ' ' ~ option_value['price_prefix'] ~ option_value['price'] : '' }}"  style="display: block;border-radius: 100px;-webkit-border-radius: 100px;-moz-border-radius: 100px" class="img-thumbnail" />
																			{% endif %}
																			{% if (theme_options.get( 'product_page_radio_style' ) != 1) %}{% if (option_value['price']) %}
																				({{ option_value['price_prefix'] }}{{ option_value['price'] }})
																			{% endif %}{% endif %}</span>
																	</label>
																</div>
															{% endfor %}

															{% if (theme_options.get( 'product_page_radio_style' ) == 1) %}
																<script type="text/javascript">
																	$(document).ready(function(){
																		$('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
																			$('#input-option{{ option['product_option_id'] }} span').removeClass("active");
																			$(this).addClass("active");
																		});
																	});
																</script>
															{% endif %}
														</div>
													</div>
												{% endif %}

												{% if (option['type'] == 'checkbox') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label">{{ option['name'] }}</label>
														<div id="input-option{{ option['product_option_id'] }}">
															{% for option_value in option['product_option_value'] %}
																<div class="checkbox {% if (theme_options.get( 'product_page_checkbox_style' ) == 1) %} {{ 'radio-type-button2' }} {% endif %}">
																	<label>
																		<input type="checkbox" name="option[{{ option['product_option_id'] }}][]" value="{{ option_value['product_option_value_id'] }}" />
																		<span>{{ option_value['name'] }}
																			{% if (theme_options.get( 'product_page_checkbox_style' ) != 1) %}{% if (option_value['price']) %}
																				({{ option_value['price_prefix'] }}{{ option_value['price'] }})
																			{% endif %}{% endif %}</span>
																	</label>
																</div>
															{% endfor %}

															{% if (theme_options.get( 'product_page_checkbox_style' ) == 1) %}
																<script type="text/javascript">
																	$(document).ready(function(){
																		$('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
																			if($(this).hasClass("active") == true) {
																				$(this).removeClass("active");
																			} else {
																				$(this).addClass("active");
																			}
																		});
																	});
																</script>
															{% endif %}
														</div>
													</div>
												{% endif %}

												{% if (option['type'] == 'image') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label">{{ option['name'] }}</label>
														<div id="input-option{{ option['product_option_id'] }}">
															{% for option_value in option['product_option_value'] %}
																<div class="radio {% if (theme_options.get( 'product_page_radio_style' ) == 1) %} {{ 'radio-type-button' }} {% endif %}">
																	<label>
																		<input type="radio" name="option[{{ option['product_option_id'] }}]" value="{{ option_value['product_option_value_id'] }}" />
																		<span {% if (theme_options.get( 'product_page_radio_style' ) == 1) %}data-toggle="tooltip" data-placement="top" title="{{ option_value['name'] }} {% if (option_value['price']) %}({{ option_value['price_prefix'] }}{{ option_value['price'] }}){% endif %}"{% endif %}><img src="{{ option_value['image'] }}" alt="{{ option_value['name'] ~ option_value['price'] ? ' ' ~ option_value['price_prefix'] ~ option_value['price'] : '' }}" {% if (theme_options.get( 'product_page_radio_style' ) == 1) %}width="{% if (theme_options.get( 'product_page_radio_image_width' ) > 0) %} {{ theme_options.get( 'product_page_radio_image_width' ) }} {% else %} {{ 25 }} {% endif %}px" height="{% if (theme_options.get( 'product_page_radio_image_height' ) > 0) %} {{ theme_options.get( 'product_page_radio_image_height' ) }} {% else %} {{ 25 }} {% endif %}px"{% endif %} /> {% if (theme_options.get( 'product_page_radio_style' ) != 1) %}{{ option_value['name'] }}
																				{% if (option_value['price']) %}
																					({{ option_value['price_prefix'] }}{{ option_value['price'] }})
																				{% endif %}{% endif %}</span>
																	</label>
																</div>
															{% endfor %}
															{% if (theme_options.get( 'product_page_radio_style' ) == 1) %}
																<script type="text/javascript">
																	$(document).ready(function(){
																		$('#input-option{{ option['product_option_id'] }}').on('click', 'span', function () {
																			$('#input-option{{ option['product_option_id'] }} span').removeClass("active");
																			$(this).addClass("active");
																		});
																	});
																</script>
															{% endif %}
														</div>
													</div>
												{% endif %}

												{% if (option['type'] == 'text') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<input type="text" name="option[{{ option['product_option_id'] }}]" value="{{ option['value'] }}" placeholder="{{ option['name'] }}" id="input-option{{ option['product_option_id'] }}" class="form-control" />
													</div>
												{% endif %}

												{% if (option['type'] == 'textarea') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<textarea name="option[{{ option['product_option_id'] }}]" rows="5" placeholder="{{ option['name'] }}" id="input-option{{ option['product_option_id'] }}" class="form-control">{{ option['value'] }}</textarea>
													</div>
												{% endif %}

												{% if (option['type'] == 'file') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label">{{ option['name'] }}</label>
														<button type="button" id="button-upload{{ option['product_option_id'] }}" class="btn btn-default btn-block" style="margin-top: 7px"><i class="fa fa-upload"></i> {{ button_upload }}</button>
														<input type="hidden" name="option[{{ option['product_option_id'] }}]" value="" id="input-option{{ option['product_option_id'] }}" />
													</div>
												{% endif %}

												{% if (option['type'] == 'date') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<div class="input-group date">
															<input type="text" name="option[{{ option['product_option_id'] }}]" value="{{ option['value'] }}" data-date-format="YYYY-MM-DD" id="input-option{{ option['product_option_id'] }}" class="form-control" />
															<span class="input-group-btn">
     			       	    <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button>
     			       	    </span></div>
													</div>
												{% endif %}

												{% if (option['type'] == 'datetime') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<div class="input-group datetime">
															<input type="text" name="option[{{ option['product_option_id'] }}]" value="{{ option['value'] }}" data-date-format="YYYY-MM-DD HH:mm" id="input-option{{ option['product_option_id'] }}" class="form-control" />
															<span class="input-group-btn">
     			       	    <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
     			       	    </span></div>
													</div>
												{% endif %}

												{% if (option['type'] == 'time') %}
													<div class="form-group{{ option['required'] ? ' required' : '' }}">
														<label class="control-label" for="input-option{{ option['product_option_id'] }}">{{ option['name'] }}</label>
														<div class="input-group time">
															<input type="text" name="option[{{ option['product_option_id'] }}]" value="{{ option['value'] }}" data-date-format="HH:mm" id="input-option{{ option['product_option_id'] }}" class="form-control" />
															<span class="input-group-btn">
     			       	    <button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button>
     			       	    </span></div>
													</div>
												{% endif %}
											{% endfor %}
										</div>
									{% endif %}
								</div>
							{% endif %}

							{% if (recurrings) %}
								<div class="options">
									<h2>{{ text_payment_recurring }}</h2>
									<div class="form-group required">
										<select name="recurring_id" class="form-control">
											<option value="">{{ text_select }}</option>
											{% for recurring in recurrings %}
												<option value="{{ recurring['recurring_id'] }}">{{ recurring['name'] }}</option>
											{% endfor %}
										</select>
										<div class="help-block" id="recurring-description"></div>
									</div>
								</div>
							{% endif %}

							<div class="cart">
								<div class="add-to-cart clearfix">

									{% set product_enquiry = theme_options.getModules('product_enquiry') %}
									{% if ( product_enquiry|length > 0 ) %}
										{% for module in product_enquiry %}
											{{ module }}
										{% endfor %}
									{% else %}
										<p>{{ entry_qty }}</p>
										<div class="quantity">
											<input type="text" name="quantity" id="quantity_wanted" size="2" value="{{ minimum }}" />
											<a href="#" id="q_up"><i class="fa fa-plus"></i></a>
											<a href="#" id="q_down"><i class="fa fa-minus"></i></a>
										</div>
										<input type="hidden" name="product_id" size="2" value="{{ product_id }}" />
										<input type="button" value="{{ button_cart }}" id="button-cart" rel="{{ product_id }}" data-loading-text="{{ text_loading }}" class="button" />


										{% set product_question = theme_options.getModules('product_question') %}
										{% if ( product_question|length > 0 ) %}
											{% for module in product_question %}
												{{ module }}
											{% endfor %}
										{% endif %}
									{% endif %}
								</div>

								<div class="links clearfix">
									<a onclick="wishlist.add('{{ product_id }}');">{% if (theme_options.get( 'add_to_wishlist_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'add_to_wishlist_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Add to wishlist' }} {% endif %}</a>
									<a onclick="compare.add('{{ product_id }}');">{% if (theme_options.get( 'add_to_compare_text', config.get( 'config_language_id' ) ) != '') %} {{ theme_options.get( 'add_to_compare_text', config.get( 'config_language_id' ) ) }} {% else %} {{ 'Add to compare' }} {% endif %}</a>
								</div>

								{% if (minimum > 1) %}
									<div class="minimum">{{ text_minimum }}</div>
								{% endif %}
							</div>
						</div><!-- End #product -->


						{% set product_options_bottom = theme_options.getModules('product_options_bottom') %}
						{% if ( product_options_bottom|length > 0 ) %}
							{% for module in product_options_bottom %}
								{{ module }}
							{% endfor %}
						{% endif %}
					</div>
				</div>
			</div>

			{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1 or product_custom_block|length > 0) %}
				<div class="col-md-3 col-sm-12">
					{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'status' ) == 1) %}
						<div class="product-block">
							{% if (theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'heading' ) != '') %}
								<h4 class="title-block">{{ theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'heading' ) }}</h4>
								<div class="strip-line"></div>
							{% endif %}
							<div class="block-content">
								{{ theme_options.html_entity_decode(theme_options.get( 'custom_block', 'product_page', config.get( 'config_language_id' ), 'text' )) }}
							</div>
						</div>
					{% endif %}

					{% for module in product_custom_block %} {{ module }} {% endfor %}
				</div>
			{% endif %}
		</div>
	</div>


	{% set product_over_tabs = theme_options.getModules('product_over_tabs') %}
	{% if ( product_over_tabs|length > 0 ) %}
		{% for module in product_over_tabs %}
			{{ module }}
		{% endfor %}
	{% endif %}


	{% set language_id = config.get( 'config_language_id' ) %}
	{% set tabs = [] %}

	{% set tabs = tabs | merge([{'content': 'description', 'heading': tab_description, 'sort': 1 }]) %}

	{% if (attribute_groups) %}
		{% set tabs = tabs | merge([{'content': 'attribute', 'heading': tab_attribute, 'sort': 3 }]) %}
	{% endif %}

	{% if (review_status) %}
		{% set tabs = tabs | merge([{'content': 'review', 'heading': tab_review, 'sort': 5 }]) %}
	{% endif %}

	{% if (config.get('product_tabs') is iterable) %}
		{% for tab in config.get('product_tabs') %}
			{% if (tab['status'] == 1 or tab['product_id'] == product_id) %}
				{% for zakladka in tab['tabs'] %}
					{% if (zakladka['status'] == 1) %}
						{% set heading = constant('false') %}
						{% set content = constant('false') %}
						{% if (zakladka[language_id] is defined) %}
							{% set heading = zakladka[language_id]['name'] %}
							{% set content = theme_options.html_entity_decode(zakladka[language_id]['html']) %}
						{% endif %}
						{% set tabs = tabs | merge([{'content': content, 'heading': heading, 'sort': zakladka['sort_order'] }]) %}
					{% endif %}
				{% endfor %}
			{% endif %}
		{% endfor %}
	{% endif %}

	{% set tabs_test = theme_options.usort(tabs) %}

	<div id="tabs" class="htabs">
		{% set i = 0 %}
		{% for tab in tabs_test  %}
			{% set i = i + 1 %}
			{% set id = 'tab_'~i %}
			{% if (tab['content'] == 'description') %} {% set id = 'tab-description' %} {% endif %}
			{% if (tab['content'] == 'attribute') %} {% set id = 'tab-attribute' %} {% endif %}
			{% if (tab['content'] == 'review') %} {% set id = 'tab-review' %} {% endif %}
			{{ '<a href="#'~id~'">'~tab['heading']~'</a>' }}
		{% endfor %}
	</div>
	{% set i = 0 %}
	{% for tab in tabs_test %}
		{% set i = i + 1 %}
		{% set id = 'tab_'~i %}
		{% if (tab['content'] != 'description' and tab['content'] != 'attribute' and tab['content'] != 'review') %}
			{{ '<div id="'~id~'" class="tab-content">'~tab['content']~'</div>' }}
		{% endif %}
	{% endfor %}
	<div id="tab-description" class="tab-content">{{ description }}</div>
	{% if (attribute_groups) %}
		<div id="tab-attribute" class="tab-content">
			<table class="attribute" cellspacing="0">
				{% for attribute_group in attribute_groups %}
					<thead>
					<tr>
						<td colspan="2">{{ attribute_group['name'] }}</td>
					</tr>
					</thead>
					<tbody>
					{% for attribute in attribute_group['attribute'] %}
						<tr>
							<td>{{ attribute['name'] }}</td>
							<td>{{ attribute['text'] }}</td>
						</tr>
					{% endfor %}
					</tbody>
				{% endfor %}
			</table>
		</div>
	{% endif %}
	{% if (review_status) %}
		<div id="tab-review" class="tab-content">
			<form class="form-horizontal" id="form-review">
				<div id="review"></div>
			</form>
		</div>
	{% endif %}

	{% if tags %}
		<p>{{ text_tags }}
			{% for i in 0..tags|length %}
				{% if i < (tags|length - 1) %} <a href="{{ tags[i].href }}">{{ tags[i].tag }}</a>,
				{% else %} <a href="{{ tags[i].href }}">{{ tags[i].tag }}</a> {% endif %}
			{% endfor %} </p>
	{% endif %}

</div>
{% if structured_data is defined %}
	{{ structured_data|raw }}
{% endif %}
<script type="text/javascript"><!--
	$('select[name=\'recurring_id\'], input[name="quantity"]').change(function(){
		$.ajax({
			url: 'index.php?route=product/product/getRecurringDescription',
			type: 'post',
			data: $('input[name=\'product_id\'], input[name=\'quantity\'], select[name=\'recurring_id\']'),
			dataType: 'json',
			beforeSend: function() {
				$('#recurring-description').html('');
			},
			success: function(json) {
				$('.alert, .text-danger').remove();

				if (json['success']) {
					$('#recurring-description').html(json['success']);
				}
			}
		});
	});
	//--></script>
<script type="text/javascript"><!--
	$('#button-cart').on('click', function() {
		$.ajax({
			url: 'index.php?route=checkout/cart/add',
			type: 'post',
			data: $('#product input[type=\'text\'], #product input[type=\'hidden\'], #product input[type=\'radio\']:checked, #product input[type=\'checkbox\']:checked, #product select, #product textarea'),
			dataType: 'json',
			beforeSend: function() {
				$('#button-cart').button('loading');
			},
			complete: function() {
				$('#button-cart').button('reset');
			},
			success: function(json) {
				$('.alert, .text-danger').remove();
				$('.form-group').removeClass('has-error');

				if (json['error']) {
					if (json['error']['option']) {
						for (i in json['error']['option']) {
							var element = $('#input-option' + i.replace('_', '-'));

							if (element.parent().hasClass('input-group')) {
								element.parent().after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
							} else {
								element.after('<div class="text-danger">' + json['error']['option'][i] + '</div>');
							}
						}
					}

					if (json['error']['recurring']) {
						$('select[name=\'recurring_id\']').after('<div class="text-danger">' + json['error']['recurring'] + '</div>');
					}

					// Highlight any found errors
					$('.text-danger').parent().addClass('has-error');
				}

				if (json['success']) {
					$.notify({
						message: json['success'],
						target: '_blank'
					},{
						// settings
						element: 'body',
						position: null,
						type: "info",
						allow_dismiss: true,
						newest_on_top: false,
						placement: {
							from: "top",
							align: "right"
						},
						offset: 20,
						spacing: 10,
						z_index: 2031,
						delay: 5000,
						timer: 1000,
						url_target: '_blank',
						mouse_over: null,
						animate: {
							enter: 'animated fadeInDown',
							exit: 'animated fadeOutUp'
						},
						onShow: null,
						onShown: null,
						onClose: null,
						onClosed: null,
						icon_type: 'class',
						template: '<div data-notify="container" class="col-xs-11 col-sm-3 alert alert-success" role="alert">' +
								'<button type="button" aria-hidden="true" class="close" data-notify="dismiss">×</button>' +
								'<span data-notify="message"><i class="fa fa-check-circle"></i>&nbsp; {2}</span>' +
								'<div class="progress" data-notify="progressbar">' +
								'<div class="progress-bar progress-bar-success" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;"></div>' +
								'</div>' +
								'<a href="{3}" target="{4}" data-notify="url"></a>' +
								'</div>'
					});

					$('#cart_block #cart_content').load('index.php?route=common/cart/info #cart_content_ajax');
					$('#cart_block #total_price_ajax').load('index.php?route=common/cart/info #total_price');
					$('#cart_block .cart-count').load('index.php?route=common/cart/info #total_count_ajax');
				}
			},
			error: function(xhr, ajaxOptions, thrownError) {
				alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
			}
		});
	});
	//--></script>
<script type="text/javascript"><!--
	$('.date').datetimepicker({
		pickTime: false
	});

	$('.datetime').datetimepicker({
		pickDate: true,
		pickTime: true
	});

	$('.time').datetimepicker({
		pickDate: false
	});

	$('button[id^=\'button-upload\']').on('click', function() {
		var node = this;

		$('#form-upload').remove();

		$('body').prepend('<form enctype="multipart/form-data" id="form-upload" style="display: none;"><input type="file" name="file" /></form>');

		$('#form-upload input[name=\'file\']').trigger('click');

		timer = setInterval(function() {
			if ($('#form-upload input[name=\'file\']').val() != '') {
				clearInterval(timer);

				$.ajax({
					url: 'index.php?route=tool/upload',
					type: 'post',
					dataType: 'json',
					data: new FormData($('#form-upload')[0]),
					cache: false,
					contentType: false,
					processData: false,
					beforeSend: function() {
						$(node).button('loading');
					},
					complete: function() {
						$(node).button('reset');
					},
					success: function(json) {
						$('.text-danger').remove();

						if (json['error']) {
							$(node).parent().find('input').after('<div class="text-danger">' + json['error'] + '</div>');
						}

						if (json['success']) {
							alert(json['success']);

							$(node).parent().find('input').attr('value', json['code']);
						}
					},
					error: function(xhr, ajaxOptions, thrownError) {
						alert(thrownError + "\r\n" + xhr.statusText + "\r\n" + xhr.responseText);
					}
				});
			}
		}, 500);
	});
	//--></script>
<script type="text/javascript"><!--
$('#review').delegate('.pagination a', 'click', function(e) {
	e.preventDefault();

	$('#review').fadeOut('slow');

	$('#review').load(this.href);

	$('#review').fadeIn('slow');
});

	$('#review').load('index.php?route=product/product/review&product_id={{ product_id }}');

	$('#button-review').on('click', function() {
		$.ajax({
			url: 'index.php?route=product/product/write&product_id={{ product_id }}',
			type: 'post',
			dataType: 'json',
			data: $("#form-review").serialize(),
			beforeSend: function() {
				$('#button-review').button('loading');
			},
			complete: function() {
				$('#button-review').button('reset');
			},
			success: function(json) {
				$('.alert-success, .alert-danger').remove();

				if (json['error']) {
					$('#review').after('<div class="alert alert-danger"><i class="fa fa-exclamation-circle"></i> ' + json['error'] + '</div>');
				}

				if (json['success']) {
					$('#review').after('<div class="alert alert-success"><i class="fa fa-check-circle"></i> ' + json['success'] + '</div>');

					$('input[name=\'name\']').val('');
					$('textarea[name=\'text\']').val('');
					$('input[name=\'rating\']:checked').prop('checked', false);
				}
			}
		});
	});
</script>
<script type="text/javascript"><!--
	$(document).ready(function() {
		$('.popup-gallery').magnificPopup({
			delegate: 'a.popup-image',
			type: 'image',
			tLoading: 'Loading image #%curr%...',
			mainClass: 'mfp-with-zoom',
			removalDelay: 200,
			gallery: {
				enabled: true,
				navigateByImgClick: true,
				preload: [0,1] // Will preload 0 - before current, and 1 after the current image
			},
			image: {
				tError: '<a href="%url%">The image #%curr%</a> could not be loaded.',
				titleSrc: function(item) {
					return item.el.attr('title');
				}
			}
		});
	});
	//--></script>
<script type="text/javascript">
	var ajax_price = function() {
		$.ajax({
			type: 'POST',
			url: 'index.php?route=product/liveprice/index',
			data: $('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\']:checked, .product-info input[type=\'checkbox\']:checked, .product-info select, .product-info textarea'),
			dataType: 'json',
			success: function(json) {
				if (json.success) {
					change_price('#price-special', json.new_price.special);
					change_price('#price-tax', json.new_price.tax);
					change_price('#price-old', json.new_price.price);
				}
			}
		});
	}

	var change_price = function(id, new_price) {
		$(id).html(new_price);
	}

	$('.product-info input[type=\'text\'], .product-info input[type=\'hidden\'], .product-info input[type=\'radio\'], .product-info input[type=\'checkbox\'], .product-info select, .product-info textarea, .product-info input[name=\'quantity\']').on('change', function() {
		ajax_price();
	});
</script>
<script type="text/javascript">
	$.fn.tabs = function() {
		var selector = this;

		this.each(function() {
			var obj = $(this);

			$(obj.attr('href')).hide();

			$(obj).click(function() {
				$(selector).removeClass('selected');

				$(selector).each(function(i, element) {
					$($(element).attr('href')).hide();
				});

				$(this).addClass('selected');

				$($(this).attr('href')).show();

				return false;
			});
		});

		$(this).show();

		$(this).first().click();
	};
</script>
<script type="text/javascript"><!--
	$('#tabs a').tabs();
	//--></script>
{% if (theme_options.get( 'product_image_zoom' ) != 2) %}
	<script type="text/javascript" src="catalog/view/theme/fastor/js/jquery.elevateZoom-3.0.3.min.js"></script>
{% endif %}
{% include 'fastor/template/new_elements/wrapper_bottom.twig' %}
{{ footer }}
